<template>
  <el-main class="main">
    <el-card style="height: 300px;width: 300px">test</el-card>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
    MAIN<br>
  </el-main>
</template>

<script>
export default {
  name: "Main"
}
</script>

<style scoped>
.main {
  background-color: yellowgreen;
  height: calc(100vh - 60px);
  transition: width .3s;
  -webkit-transition: width .3s;
}
</style>